<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>promise代码重排</title>
  <script type="text/javascript" src="script/jquery-3.6.0.min.js"></script>
  <script type="text/javascript">
    //将重复的代码，抽出来,编写一个方法get
    //url ajax请求的资源
    // data ajax请求携带的数据
    function get(url, data) {
      return new Promise((resolve, reject) => {
        $.ajax({
          url: url,
          data: data,
          success(resultData){
            resolve(resultData);
          },
          error(err){
            reject(err);
          }
        })
      })
    }

    get("Data/monster.json").then((resultData)=>{
      //第1次ajax请求成功后的处理代码
      console.log("第1次ajax请求返回数据=", resultData);
      return get(`data/monster_detail_${resultData.id}.json`);
    }).then((resultData) =>{
      //第2次ajax请求成功后的处理代码
      console.log("第2次ajax请求返回数据=", resultData);
      return get(`data/monster_gf_${resultData.gfid}.json`);
    }).then((resultData) => {
      //第3次ajax请求成功后的处理代码
      console.log("第3次ajax请求返回数据=", resultData);
      //继续..
    }).catch(err => {
      console.log("promise请求异常=", err);
    })
  </script>
</head>
<body>
</body>
</html>
